<!-- 正文开始 -->
<div class="layui-fluid" id="mainResource">
    <div class="layui-card">
        <div class="layui-card-header">筛选条件</div>
        <div class="layui-card-body">
            <form class="layui-form layui-form-pane">
                <div class="layui-row layui-col-space10">
                    <div class="layui-col-md3 layui-col-sm12 layui-col-xs12">
                        <label class="layui-form-label">名称</label>
                        <div class="layui-input-block">
                            <input type="text" name="name" autocomplete="off" placeholder="请输入菜单名称" class="layui-input">
                        </div>
                    </div>
                    <div class="layui-col-md3 layui-col-sm12 layui-col-xs12">
                        <label class="layui-form-label">状态</label>
                        <div class="layui-input-block">
                            <select id="queryStateResource" name="state"></select>
                        </div>
                    </div>
                    <div class="layui-col-md3 layui-col-sm12 layui-col-xs12">
                        <label class="layui-form-label">类型</label>
                        <div class="layui-input-block">
                            <select id="queryTypeResource" name="type"></select>
                        </div>
                    </div>
                    <div class="layui-col-md2 layui-col-sm12 layui-col-xs12">
                        <button class="layui-btn layui-btn-fluid" lay-submit
                                id="querySubmitResource" lay-filter="querySubmitResource">筛选
                        </button>
                    </div>
                    <div class="layui-col-md1 layui-col-sm12 layui-col-xs12">
                        <button type="reset" class="layui-btn layui-btn-primary layui-btn-fluid">重置</button>
                    </div>
                </div>
            </form>
        </div>
    </div>

    <div class="layui-card">
        <table id="listResource" lay-filter="listResource"></table>
    </div>
</div>

<!-- 表格批量工具栏 -->
<script type="text/html" id="listToolbarResource">
    <div class="layui-btn-container">
        {{# if(layui.admin.hasPerm(layui.reqApi.admin.resource.createOrUpdate.getPermissionUrl("POST"))){ }}
        <a class="layui-btn layui-btn-sm" lay-event="listToolbarSaveResource">
            <i class="layui-icon">&#xe61f;</i>添加目录</a>
        {{# } if(layui.admin.hasPerm(layui.reqApi.admin.resource.batchUpdateParent.getPermissionUrl("PUT"))){ }}
        <a class="layui-btn layui-btn-sm layui-btn-normal" lay-event="listToolbarUpdateParentResource">
            <i class="layui-icon">&#xe642;</i>更新上级</a>
        {{# } if(layui.admin.hasPerm(layui.reqApi.admin.resource.refreshResource.getPermissionUrl("PUT"))){ }}
        <a class="layui-btn layui-btn-danger layui-btn-sm" lay-event="listToolbarRefreshResource">
            <i class="layui-icon">&#xe669;</i>资源刷新</a>
        {{# } }}
        <a class="layui-btn layui-btn-sm" lay-event="listToolbarUnfoldResource">
            <i class="layui-icon">&#xe625;</i>全部展开</a>
        <a class="layui-btn layui-btn-sm layui-btn-normal" lay-event="listToolbarFoldResource">
            <i class="layui-icon">&#xe623;</i>全部折叠</a>
        {{# if(layui.admin.hasPerm(layui.reqApi.admin.resource.batchUpdateState.getPermissionUrl("PUT"))){ }}
        <a class="layui-btn layui-btn-sm layui-btn-primary" lay-event="listToolbarEnableResource">
            <i class="layui-icon">&#x1005;</i>批量启用</a>
        <a class="layui-btn layui-btn-sm layui-btn-primary" lay-event="listToolbarDisableResource">
            <i class="layui-icon">&#x1007;</i>批量禁用</a>
        {{# } if(layui.admin.hasPerm(layui.reqApi.admin.resource.batchDelete.getPermissionUrl("POST"))){ }}
        <a class="layui-btn layui-btn-danger layui-btn-sm" lay-event="listToolbarDelResource">
            <i class="layui-icon">&#xe640;</i>批量删除</a>
        {{# } }}
    </div>
</script>

<!-- 表格logo模板 -->
<script type="text/html" id="listLogoTplResource">
    <i class="layui-icon '+ {{d.icon}} +'"></i>
</script>

<!-- 表格状态模板 -->
<script type="text/html" id="listStateTplResource">
    {{#  if(layui.reqEnum.state.normal === d.state){ }}
    <span style="color: #009688;">{{ d.stateStr }}</span>
    {{#  } else if(layui.reqEnum.state.disable === d.state) { }}
    <span style="color: #d2d2d2;">{{ d.stateStr }}</span>
    {{#  } else { }}
    <span>{{ d.state_str }}</span>
    {{#  } }}
</script>

<!-- 表格资源类型模板 -->
<script type="text/html" id="listTypeTplResource">
    {{#  if(layui.reqEnum.resourceType.directory === d.type){ }}
    <span class="layui-badge layui-bg-green">{{ d.typeStr }}</span>
    {{#  } else if(layui.reqEnum.resourceType.menu === d.type) { }}
    <span class="layui-badge layui-bg-blue">{{ d.typeStr }}</span>
    {{#  } else if(layui.reqEnum.resourceType.resource === d.type) { }}
    <span class="layui-badge">{{ d.typeStr }}</span>
    {{#  } else { }}
    <span>{{ d.typeStr }}</span>
    {{#  } }}
</script>

<!-- 表格权限类型模板 -->
<script type="text/html" id="listPermissionTypeTplResource">
    {{#  if(layui.reqEnum.resourcePermissionType.notPermission === d.permissionType){ }}
    <span class="layui-badge layui-bg-green">{{ d.permissionTypeStr }}</span>
    {{#  } else if(layui.reqEnum.resourcePermissionType.login === d.permissionType) { }}
    <span class="layui-badge layui-bg-blue">{{ d.permissionTypeStr }}</span>
    {{#  } else if(layui.reqEnum.resourcePermissionType.permission === d.permissionType) { }}
    <span class="layui-badge layui-bg-red">{{ d.permissionTypeStr }}</span>
    {{#  } else { }}
    <span>{{ d.permissionTypeStr }}</span>
    {{#  } }}
</script>

<!-- 表格操作模板 -->
<script type="text/html" id="listToolResource">
    {{#  if(layui.reqEnum.resourceType.directory === d.type
    && layui.admin.hasPerm(layui.reqApi.admin.resource.createOrUpdate.getPermissionUrl("POST"))){ }}
    <a class="layui-btn layui-btn-xs" lay-event="listToolInsertMenuResource"> 添加菜单 </a>
    {{#  } else if(layui.reqEnum.resourceType.menu === d.type
    && layui.admin.hasPerm(layui.reqApi.admin.resource.createOrUpdate.getPermissionUrl("POST"))) { }}
    <a class="layui-btn layui-btn-xs layui-btn-normal" lay-event="listToolInsertResource"> 添加资源 </a>
    {{# } if(layui.admin.hasPerm(layui.reqApi.admin.resource.createOrUpdate.getPermissionUrl("POST"))){ }}
    <a class="layui-btn layui-btn-xs layui-btn-primary" lay-event="listToolUpdateResource"> 编辑 </a>
    {{# } if(layui.admin.hasPerm(layui.reqApi.admin.resource.batchDelete.getPermissionUrl("POST"))){ }}
    <a class="layui-btn layui-btn-xs layui-btn-danger" lay-event="listToolDelResource"> 删除 </a>
    {{# } }}
</script>

<!-- 新增或者修改 -->
<script type="text/html" id="suContainerResource">
    <form lay-filter="suFormResource" class="layui-form layui-form-pane">
        <input name="id" type="hidden"/>
        <div class="layui-form-item">
            <label class="layui-form-label red-star-label">资源类型</label>
            <div class="layui-input-block">
                <select name="type" id="suTypeResource" lay-filter="suTypeResource"
                        lay-verType="tips" lay-verify="required"></select>
            </div>
        </div>
        <div class="layui-form-item" id="suPIdContainerResource" style="display: none">
            <label class="layui-form-label red-star-label">上级菜单</label>
            <div class="layui-input-block">
                <input name="parentId" id="suParentIdResource" type="hidden"/>
                <input name="parentName" id="suParentNameResource"
                       placeholder="请点击选择" type="text" class="layui-input" maxlength="64" lay-verType="tips"
                       lay-verify="isNotNull" readonly/>
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label red-star-label">资源名</label>
            <div class="layui-input-block">
                <input name="name" placeholder="请输入资源名称" type="text" class="layui-input" maxlength="64"
                       lay-verType="tips" lay-verify="required"/>
            </div>
        </div>
        <div class="layui-form-item" id="suIconContainerResource" style="display: none">
            <label class="layui-form-label red-star-label"
                   style="height: 40px;line-height: 25px;border-right: none">目录图标</label>
            <div class="layui-input-block">
                <input name="icon" id="suIconResource" lay-filter="suIconResource"
                       placeholder="请输入目录图标" type="text" class="layui-input"
                       lay-verType="tips" lay-verify="isNotNull"/>
            </div>
        </div>
        <div class="layui-form-item" id="suUriContainerResource" style="display: none">
            <label class="layui-form-label">菜单地址</label>
            <div class="layui-input-block">
                <input name="uri" placeholder="请输入菜单地址" type="text" class="layui-input" maxlength="128"/>
            </div>
        </div>
        <div class="layui-form-item" id="suPermissionContainerResource" style="display: none">
            <label class="layui-form-label red-star-label">表达式</label>
            <div class="layui-input-block">
                <input name="permission" placeholder="请输入表达式" type="text" class="layui-input" maxlength="255"
                       lay-verType="tips" lay-verify="isNotNull"/>
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label red-star-label">权限类型</label>
            <div class="layui-input-block">
                <select id="suPermissionTypeResource" name="permissionType"
                        lay-filter="suPermissionTypeResource" lay-verType="tips" lay-verify="required"></select>
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label red-star-label">资源序号</label>
            <div class="layui-input-block">
                <input name="sort" placeholder="请输入资源序号" type="number" class="layui-input" min="0" max="1000"
                       lay-verType="tips" lay-verify="required|number"/>
            </div>
        </div>
        <div class="layui-form-item  layui-form-text">
            <label class="layui-form-label layui-btn-fluid">备注</label>
            <div class="layui-input-block">
                <textarea name="remark" placeholder="请输入备注" class="layui-textarea"></textarea>
            </div>
        </div>
        <div class="layui-form-item text-right">
            <button class="layui-btn layui-btn-primary" type="button" ew-event="closeDialog">取消</button>
            <button class="layui-btn" lay-filter="suSubmitResource" lay-submit>保存</button>
        </div>
    </form>
</script>

<!-- js部分 -->
<script>
    layui.use(['layer', 'table', 'admin', 'setter', 'treetable', 'form', 'reqApi', 'reqEnum', 'promiseReq', 'dtree', 'iconPicker'], function () {
        var $ = layui.jquery;
        var layer = layui.layer;
        var table = layui.table;
        var admin = layui.admin;
        var setter = layui.setter;
        var treetable = layui.treetable;
        var form = layui.form;
        var reqApi = layui.reqApi;
        var reqEnum = layui.reqEnum;
        var promiseReq = layui.promiseReq;
        var dtree = layui.dtree;
        var iconPicker = layui.iconPicker;

        // 引用对象
        var main = 'mainResource'
            , queryState = 'queryStateResource'
            , queryType = 'queryTypeResource'
            , querySubmit = 'querySubmitResource'
            , list = 'listResource'
            , listToolbar = 'listToolbarResource'
            , listToolbarSave = 'listToolbarSaveResource'
            , listToolbarUpdateParent = 'listToolbarUpdateParentResource'
            , listToolbarRefresh = 'listToolbarRefreshResource'
            , listToolbarUnfold = 'listToolbarUnfoldResource'
            , listToolbarFold = 'listToolbarFoldResource'
            , listToolbarEnable = 'listToolbarEnableResource'
            , listToolbarDisable = 'listToolbarDisableResource'
            , listToolbarDel = 'listToolbarDelResource'
            , listLogoTpl = 'listLogoTplResource'
            , listStateTpl = 'listStateTplResource'
            , listTypeTpl = 'listTypeTplResource'
            , listPermissionTypeTpl = 'listPermissionTypeTplResource'
            , listTool = 'listToolResource'
            , listToolInsertMenu = 'listToolInsertMenuResource'
            , listToolInsert = 'listToolInsertResource'
            , listToolUpdate = 'listToolUpdateResource'
            , listToolDel = 'listToolDelResource'
            , suContainer = 'suContainerResource'
            , suForm = 'suFormResource'
            , suType = 'suTypeResource'
            , suPIdContainer = 'suPIdContainerResource'
            , suParentId = 'suParentIdResource'
            , suParentName = 'suParentNameResource'
            , suIconContainer = 'suIconContainerResource'
            , suIcon = 'suIconResource'
            , suUriContainer = 'suUriContainerResource'
            , suPermissionContainer = 'suPermissionContainerResource'
            , suPermissionType = 'suPermissionTypeResource'
            , suSubmit = 'suSubmitResource'

        var updateParentOpen = 'updateParentOpenResource'
            , updateParentTree = 'updateParentTreeResource'
            , suOpen = 'suOpenResource'
            , pResourceOpen = 'pResourceOpenResource'
            , pResourceTree = 'pResourceTreeResource'

        // 等待框
        admin.showLoading('#' + main, 1, '.5');

        // 验证规则
        form.verify({
            isNotNull: function (value, item) {
                if (!$(item).is(":hidden") && !value) {
                    return '必填项不能为空';
                }
            }
        });

        // 字典
        var listStateReq = promiseReq.req({
            url: reqApi.admin.home.enum.restfulFormat({enumName: 'StateEnum'})
            , success: function (rs) {
                var dataList = rs.data;
                var str = '<option value="">请选择</option>';
                for (var i = 0; i < dataList.length; i++) {
                    var data = dataList[i];
                    str += '<option value="' + data.value + '">' + data.msg + '</option>'
                }
                $('#' + queryState).empty();
                $('#' + queryState).append(str);
            }
        });
        var listTypeReq = promiseReq.req({
            url: reqApi.admin.home.enum.restfulFormat({enumName: 'ResourceTypeEnum'})
            , success: function (rs) {
                var dataList = rs.data;
                var str = '<option value="">请选择</option>';
                for (var i = 0; i < dataList.length; i++) {
                    var data = dataList[i];
                    str += '<option value="' + data.value + '">' + data.msg + '</option>'
                }
                $('#' + queryType).empty();
                $('#' + queryType).append(str);
            }
        });

        // 筛选
        form.on('submit(' + querySubmit + ')', function (obj) {
            admin.showLoading('#' + main, 1, '.5');
            listRender(obj.field);
            return false;
        });

        // 表格筛选触发
        function listQuery() {
            $('#' + querySubmit).click();
        }

        // 执行
        listRender();

        // 表格渲染
        function listRender(param) {
            // 权限设置
            var handle = [{title: '操作', align: "left", templet: '#' + listTool, width: 200}];
            var treeColIndex = 3;
            if (!admin.hasPerm(layui.reqApi.admin.resource.createOrUpdate.getPermissionUrl("POST"))
                && !admin.hasPerm(layui.reqApi.admin.resource.batchDelete.getPermissionUrl("POST"))) {
                handle = [];
                treeColIndex = 2;
            }

            // 初始化
            treetable.render({
                elem: '#' + list
                , treeColIndex: treeColIndex
                , treeSpid: 0
                , treeIdName: 'authorityId'
                , treePidName: 'parentId'
                , treeDefaultClose: false
                , treeLinkage: false
                , toolbar: '#' + listToolbar
                , headers: {Authorization: setter.getBearerToken()}
                , url: reqApi.admin.resource.list
                , cellMinWidth: 100
                , cols: [
                    [{title: '序号', field: 'sort', align: 'center', width: 100},
                        {type: 'checkbox', width: 60}]
                        .concat(handle)
                        .concat([{title: '资源名称', field: 'name', align: 'left', width: 200},
                            {title: '图标', field: 'icon', align: 'center', templet: '#' + listLogoTpl, width: 60},
                            {title: '地址', field: 'uri', align: 'left', minWidth: 200},
                            {title: '表达式', field: 'permission', align: 'left', minWidth: 200},
                            {title: '类型', field: 'type', align: 'center', templet: '#' + listTypeTpl, width: 100},
                            {title: '状态', field: 'state', align: 'center', templet: '#' + listStateTpl, width: 60},
                            {
                                title: '权限类型', field: 'permissionType', align: 'center',
                                templet: '#' + listPermissionTypeTpl, width: 100
                            },
                            {title: '修改时间', field: 'gmtModified', align: 'center', width: 200},
                            {title: '创建时间', field: 'gmtCreate', align: 'center', width: 200},
                            {title: '备注', field: 'remark', align: 'left', minWidth: 200}
                        ])
                ]
                , where: param
                , done: function () {
                    Promise.all([listStateReq, listTypeReq]).finally(function () {
                        form.render();
                        admin.removeLoading('#' + main);
                    });
                }
                , defaultToolbar: []
            });
        }

        // 监听表格批量工具栏
        table.on('toolbar(' + list + ')', function (obj) {
            switch (obj.event) {
                case listToolbarSave:
                    suRender();
                    break;
                case listToolbarUpdateParent:
                    var data = table.checkStatus(list).data;
                    if (0 === data.length) {
                        layer.msg('请勾选要操作的数据', {time: 1000});
                        break;
                    }
                    var idList = [];
                    for (var i in data) {
                        idList[i] = data[i].id;
                    }
                    updateParentRender(idList);
                    break;
                case listToolbarRefresh:
                    refreshRender();
                    break;
                case listToolbarUnfold:
                    treetable.expandAll('#' + list);
                    break;
                case listToolbarFold:
                    treetable.foldAll('#' + list);
                    break;
                case listToolbarEnable:
                    updateStateRender(reqEnum.state.normal);
                    break;
                case listToolbarDisable:
                    updateStateRender(reqEnum.state.disable);
                    break;
                case listToolbarDel:
                    var data = table.checkStatus(list).data;
                    if (0 === data.length) {
                        layer.msg('请勾选要删除的数据', {time: 1000});
                        break;
                    }
                    var idList = [];
                    for (var i in data) {
                        idList[i] = data[i].id;
                    }
                    delRender(idList);
                    break;
            }
        });

        // 监听表格操作行
        table.on('tool(' + list + ')', function (obj) {
            var id = obj.data.id;
            var name = obj.data.name;
            switch (obj.event) {
                case listToolInsertMenu:
                    suRender(reqEnum.resourceType.menu, null, id, name);
                    break;
                case listToolInsert:
                    suRender(reqEnum.resourceType.resource, null, id, name);
                    break;
                case listToolUpdate:
                    suRender(null, id);
                    break;
                case listToolDel:
                    delRender([id]);
                    break;
            }
        });

        // 更新上级
        function updateParentRender(idList) {
            admin.open({
                id: updateParentOpen
                , title: '上级菜单'
                , type: 1
                , shadeClose: true
                , content: '<ul id=' + updateParentTree + ' class="dtree" data-id="0"></ul>'
                , btn: false
                , success: function (layero, index) {
                    admin.showLoading('#' + updateParentOpen, 1, '.5');
                    admin.req({
                        url: reqApi.admin.resource.pResource
                        , type: 'get'
                        , complete: function () {
                            admin.removeLoading('#' + updateParentOpen);
                        }
                        , success: function (rs) {
                            if (!rs || !rs.data || 0 === rs.data.length) {
                                layer.msg('暂无资源', {time: 1000});
                                return;
                            }
                            dtree.render({
                                elem: '#' + updateParentTree
                                , data: rs.data
                                , response: {rootName: "result", treeId: "id", parentId: "parentId", title: "name"}
                                , skin: "resource"
                                , dot: false
                                , nodeIconArray: {'1': {'open': 'dtree-icon-move-down', 'close': 'dtree-icon-move-up'}}
                                , leafIconArray: {'2': 'dtree-icon-home1'}
                                , icon: ['1', '2']
                                , dataFormat: 'list'
                                , dataStyle: 'layuiStyle'
                            });
                            dtree.on('nodedblclick(' + updateParentTree + ')', function (obj) {
                                var reqEL = layer.msg('操作执行中', {icon: 16, shade: 0.01, time: 6000});
                                admin.req({
                                    url: reqApi.admin.resource.batchUpdateParent
                                    , type: 'put'
                                    , data: {'idList': idList, 'parentId': obj.param.nodeId}
                                    , complete: function () {
                                        layer.close(reqEL);
                                    }
                                    , success: function () {
                                        layer.msg('操作成功', {offset: '15px', icon: 1, time: 500});
                                        listQuery();
                                        layer.close(index);
                                    }
                                });
                            });
                        }
                    });
                }
            });
        }

        // 资源刷新
        function refreshRender() {
            layer.confirm('确定刷新资源？', {
                skin: 'layui-layer-admin'
                , btn: ['确定', '取消']
            }, function () {
                var reqEL = layer.msg('操作执行中', {icon: 16, shade: 0.01, time: 6000});
                admin.req({
                    url: reqApi.admin.resource.refreshResource
                    , type: 'put'
                    , complete: function () {
                        layer.close(reqEL);
                    }
                    , success: function () {
                        layer.msg('操作成功', {offset: '15px', icon: 1, time: 500});
                        listQuery();
                    }
                });
            }, function () {
            });
        }

        // 启用或者禁用操作
        function updateStateRender(state) {
            var data = table.checkStatus(list).data;
            if (0 === data.length) {
                layer.msg('请勾选要操作的数据', {time: 1000});
                return;
            }
            var idList = [];
            for (var i in data) {
                idList[i] = data[i].id;
            }
            layer.confirm('确定操作所选信息？', {
                skin: 'layui-layer-admin'
                , btn: ['确定', '取消'] //按钮
            }, function () {
                var reqEL = layer.msg('操作执行中', {icon: 16, shade: 0.01, time: 6000});
                admin.req({
                    url: reqApi.admin.resource.batchUpdateState
                    , type: 'put'
                    , data: {'idList': idList, 'state': state}
                    , complete: function () {
                        layer.close(reqEL);
                    }
                    , success: function () {
                        listQuery();
                        layer.msg('操作成功', {offset: '15px', icon: 1, time: 1000});
                    }
                });
            }, function () {
            });
        }

        // 删除操作
        function delRender(idList) {
            layer.confirm('确定删除所选信息？', {
                skin: 'layui-layer-admin'
                , btn: ['确定', '取消']
            }, function () {
                var reqEL = layer.msg('操作执行中', {icon: 16, shade: 0.01, time: 6000});
                admin.req({
                    url: reqApi.admin.resource.batchDelete
                    , type: 'post'
                    , data: idList
                    , complete: function () {
                        layer.close(reqEL);
                    }
                    , success: function () {
                        layer.msg('操作成功', {offset: '15px', icon: 1, time: 500});
                        listQuery();
                    }
                });
            }, function () {
            });
        }

        // 新增或者修改
        function suRender(type, id, parentId, parentName) {
            type = type ? type : reqEnum.resourceType.directory
            admin.open({
                id: suOpen
                , type: 1
                , title: '新增 or 修改'
                , shadeClose: true
                , content: $('#' + suContainer).html()
                , success: function (layero, index) {
                    admin.showLoading('#' + suOpen, 1, '.5');
                    suSubmitRender(index);
                    var suTypeReq = promiseReq.req({
                        url: reqApi.admin.home.enum.restfulFormat({enumName: 'ResourceTypeEnum'})
                        , success: function (rs) {
                            var dataList = rs.data;
                            var str = '<option value="">请选择</option>';
                            for (var i = 0; i < dataList.length; i++) {
                                var data = dataList[i];
                                str += '<option value="' + data.value + '">' + data.msg + '</option>'
                            }
                            $('#' + suType).empty();
                            $('#' + suType).append(str);
                            form.val(suForm, {
                                "type": type
                            })
                            listenerResourceTypeHandleRender(type);
                            form.on('select(' + suType + ')', function (data) {
                                listenerResourceTypeHandleRender(data.value);
                            });
                        }
                    });
                    var suPermissionTypeReq = promiseReq.req({
                        url: reqApi.admin.home.enum.restfulFormat({enumName: 'ResourcePermissionTypeEnum'})
                        , success: function (rs) {
                            var dataList = rs.data;
                            var str = '<option value="">请选择</option>';
                            for (var i = 0; i < dataList.length; i++) {
                                var data = dataList[i];
                                str += '<option value="' + data.value + '">' + data.msg + '</option>'
                            }
                            $('#' + suPermissionType).empty();
                            $('#' + suPermissionType).append(str);
                        }
                    });
                    iconPicker.render({
                        elem: '#' + suIcon
                        , type: 'fontClass'
                        , search: true,
                        click: function (data) {
                            form.val(suForm, {"icon": data.icon});
                        }
                    });
                    iconPicker.checkIcon(suIcon, 'layui-icon-home');

                    if (id) {
                        var infoReq = promiseReq.req({
                            url: reqApi.admin.resource.get.restfulFormat({id: id})
                            , success: function (rs) {
                                Promise.all([suTypeReq, suPermissionTypeReq]).finally(function () {
                                    var data = rs.data;
                                    form.val(suForm, {
                                        "parentId": data.parentId
                                        , "parentName": data.parentName
                                        , "id": id
                                        , "type": data.type
                                        , "name": data.name
                                        , "icon": data.icon
                                        , "uri": data.uri
                                        , "permission": data.permission
                                        , "permissionType": data.permissionType
                                        , "sort": data.sort
                                        , "remark": data.remark
                                    });
                                    if (data.icon) {
                                        iconPicker.checkIcon(suIcon, data.icon);
                                    }
                                    listenerResourceTypeHandleRender(data.type);
                                });
                            }
                        });
                        Promise.all([suTypeReq, suPermissionTypeReq, infoReq]).finally(function () {
                            admin.removeLoading('#' + suOpen);
                            form.render();
                        });
                    } else {
                        Promise.all([suTypeReq, suPermissionTypeReq]).finally(function () {
                            admin.removeLoading('#' + suOpen);
                            form.render();
                        });
                    }
                    if (parentId) {
                        $('#' + suParentId).val(parentId);
                    }
                    if (parentName) {
                        $('#' + suParentName).val(parentName);
                    }
                }
            });
        }

        // 监听资源类型选择
        function listenerResourceTypeHandleRender(value) {
            $('#' + suPIdContainer).hide();
            $('#' + suIconContainer).hide();
            $('#' + suUriContainer).hide();
            $('#' + suPermissionContainer).hide();
            if (reqEnum.resourceType.directory == value) {
                $('#' + suIconContainer).show();
                $('#' + suUriContainer).show();
            } else if (reqEnum.resourceType.menu == value) {
                $('#' + suPIdContainer).show();
                $('#' + suUriContainer).show();
                pResourceRender();
            } else if (reqEnum.resourceType.resource == value) {
                $('#' + suPIdContainer).show();
                $('#' + suPermissionContainer).show();
                pResourceRender();
            }
        }

        // 初始化上级菜单
        function pResourceRender() {
            $('#' + suParentName).click(function () {
                admin.open({
                    id: pResourceOpen
                    , title: '上级菜单'
                    , type: 1
                    , shadeClose: true
                    , content: '<ul id="' + pResourceTree + '" class="dtree" data-id="0"></ul>'
                    , btn: false
                    , success: function (layero, index) {
                        admin.showLoading('#' + pResourceOpen, 1, '.5');
                        admin.req({
                            url: reqApi.admin.resource.pResource
                            , type: 'get'
                            , complete: function () {
                                admin.removeLoading('#' + pResourceOpen, true, true);
                            }
                            , success: function (rs) {
                                if (!rs || !rs.data || 0 === rs.data.length) {
                                    layer.msg('暂无资源', {time: 1000});
                                    return;
                                }
                                dtree.render({
                                    elem: '#' + pResourceTree,
                                    data: rs.data,
                                    response: {rootName: "result", treeId: "id", parentId: "parentId", title: "name"},
                                    skin: "resource",
                                    dot: false,
                                    nodeIconArray: {
                                        '1': {
                                            'open': 'dtree-icon-move-down',
                                            'close': 'dtree-icon-move-up'
                                        }
                                    },
                                    leafIconArray: {'2': 'dtree-icon-home1'},
                                    icon: ['1', '2'],
                                    dataFormat: 'list',
                                    dataStyle: 'layuiStyle',
                                    complete: function () {
                                        dtree.dataInit(pResourceTree, $('#' + suParentId).val());
                                    }
                                });
                                dtree.on("nodedblclick('" + pResourceTree + "')", function (obj) {
                                    $("#" + suParentId).val(obj.param.nodeId);
                                    $("#" + suParentName).val(obj.param.context);
                                    layer.close(index);
                                });
                            }
                        });
                    }
                });
            });
        }

        // 初始化新增或者修改提交
        function suSubmitRender(index) {
            form.on('submit(' + suSubmit + ')', function (obj) {
                var reqEL = layer.msg('操作执行中', {icon: 16, shade: 0.01, time: 6000});
                if (reqEnum.resourceType.directory == obj.field.type) {
                    obj.field.parentId = '';
                    obj.field.permission = '';
                } else if (reqEnum.resourceType.menu == obj.field.type) {
                    obj.field.icon = '';
                    obj.field.permission = '';
                } else if (reqEnum.resourceType.resource == obj.field.type) {
                    obj.field.icon = '';
                    obj.field.uri = '';
                }
                admin.req({
                    url: reqApi.admin.resource.createOrUpdate
                    , type: 'post'
                    , data: obj.field
                    , complete: function () {
                        layer.close(reqEL);
                    }
                    , success: function () {
                        layer.msg('操作成功', {offset: '15px', icon: 1, time: 500});
                        layer.close(index);
                        listQuery();
                    }
                });
                return false;
            });
        }
    });
</script>